<!-- 评价管理 -->
<template>
    <view class="box">
        <view class="search-box">
            <uni-search-bar @confirm="search"  :focus="true" v-model="searchValue" 
                @input="input" cancelButton="none" radius="60" bgColor="#F7F7F7" placeholder="搜索商品名称~">
            </uni-search-bar>
        </view>
        <view class="goods-list-box">
            <view class="order-list-1" v-for="item in list" :key="item.geval_id">
                <view class="order-list-info">
                    <view class="order-shopname"><span class="shop-icon">{{item.geval_physical_name.substring(0,1)}}</span>{{item.geval_physical_name}}</view>
                    <view class="order-time">{{item.geval_addtime}}</view>
                </view>
                <view class="order-list-2">
                     <view class="order-list-icon">
                         <image :src="item.geval_goodsimage"></image>
                     </view>
                     <view class="order-info">
                         <view class="order-name">{{item.geval_goodsname}}</view>
                         <view class="order-text">
                             <view class="order-score">评分：</view>
                             <view class="order-score-icon">
                                 <uni-rate :size="18" :value="item.geval_scores" :disabled="true" activeColor="#E96A1D" disabledColor="#F3F3F3" />
                             </view>
                         </view>
                     </view>
                </view>
                <view class="order-evaluate">评价：{{item.geval_content}}</view>
            </view>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
               searchValue: '',
               list: [],
			   goods_name: "", //商品名称
			   curpage: 1, //页码
			   hasmore: false, //是否有下一页
            }
        },
        onReady() {
        	this.getEvaList()
			this.curpage++
			this.getEvaList()
        },
        methods: {
        	search(res) { //搜索商品
        		this.hasmore = true
        		if (res != undefined) {
        			this.searchValue = res.value
        		}
        		this.list = []
        		this.curpage=1
        		this.goods_name = this.searchValue
        		this.getEvaList()
        	},
        	input(res){
        		if(res==""){
        			this.curpage=1
        			this.goods_name=""
        			this.list=[]
        			this.getEvaList()
					this.curpage++
					this.getEvaList()
        		}
        	},
        	getEvaList() { //获取评价列表
        		let url = '';
        		if (!uni.getStorageSync("key")) {
        			return uni.redirectTo({
        				url: "/SupplyEnd/login/login",
        			});
        		}
        		url = "/mobile/index.php?act=supplier-evaluate&op=index";
        		let that = this
        		this.$util.request({
        			url: url,
        			method: 'get',
        			data: {
        				goods_name: that.goods_name,
        				curpage: that.curpage
        			}
        		}).then(res => {
        			if (res.error_code == 0) {
        				//更新页面数据
        				that.list = that.list.concat(res.datas.list)
        				that.hasmore = res.datas.paged.hasmore
						console.log(that.list)
        			} else {
        				uni.showToast({
        					title: res.message,
        					icon: "none"
        				})
        			}
        		})
        	},
        },
        onReachBottom() { //下拉加载
        	if (this.hasmore == true) {
        		uni.showLoading({
        			title: "加载中"
        		})
        		this.curpage++
        		this.getEvaList()
        	} else {
        		uni.showLoading({
        			title: "没有更多数据了",
        			icon: "none",
        			duration: 1000
        		})
        		setTimeout(() => {
        			uni.hideLoading()
        		}, 500)
        	}
        	setTimeout(() => {
        		uni.hideLoading()
        	}, 500)
        },
        onBackPress() {
        	// #ifdef APP-PLUS
        	plus.key.hideSoftKeybord();
        	uni.navigateTo({
        		url: "/SupplyEnd/taber/home"
        	})
        	// #endif
        }
    }
</script>

<style lang="scss" scoped>
    page {
        background: #F7F7F7;
    }
    
    .search-box{
        background: #FFFFFF;
    }
    
    .goods-list-box{
        padding: 30rpx;
        .order-list-1{
            background-color: #FFF;
            border-radius: 5rpx 5rpx 5rpx 5rpx;
            display: flex;
            flex-direction: column;
            padding: 20rpx 30rpx;
			border-bottom: 2rpx solid #EEEEEE;
			
            .order-list-info{
                display: flex;
                justify-content: space-between;
                .order-shopname{
                    font-size: 28rpx;
                    font-family: PingFang SC-Regular, PingFang SC;
                    font-weight: 400;
                    color: #323232;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    .shop-icon{
                        width: 38rpx;
                        height: 38rpx;
                        background: linear-gradient(180deg, #EA8C1E 0%, #E84A1D 100%);
                        opacity: 1;
                        
                        font-size: 20rpx;
                        font-family: PingFang SC-Regular, PingFang SC;
                        font-weight: 400;
                        color: #FFFFFF;
                        
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        border-radius: 50%;
                        margin-right: 10rpx;
                        
                        text{
                            transform: scale(0.8);
                            font-family: 500;
                        }
                    }
                }
                .order-time{
                    font-size: 28rpx;
                    font-family: PingFang SC-Regular, PingFang SC;
                    font-weight: 400;
                    color: #999999;
                }
            }
            .order-list-2{
                display: flex;
                margin-top: 20rpx;
                .order-list-icon{
                    width: 200rpx;
                    height: 200rpx;
                    image{
                        width: 200rpx;
                        height: 200rpx;
                        border-radius: 5rpx;
                    }
                }
                .order-info{
                    margin-left: 30rpx;
                    display: flex;
					flex-direction: column;
					justify-content: space-between;
                    .order-name{
                        font-size: 28rpx;
                        font-family: PingFang SC-Regular, PingFang SC;
                        font-weight: 400;
                        color: #323232;
                    }
                    .order-text{
                        display: flex;
                        .order-score{
                            font-size: 30rpx;
                            font-family: PingFang SC-Medium, PingFang SC;
                            font-weight: 500;
                            color: #909090;
                        }
                        /deep/ .uni-rate {
                            margin-top: 10rpx;
                        }
                        .order-score-icon{
                            display: flex;
                            align-items: center;
                        }
                    }
                }
            }
        }
        .order-evaluate{
            font-size: 24rpx;
            font-family: PingFang SC-Regular, PingFang SC;
            font-weight: 400;
            color: #909090;
            margin-top: 20rpx;
        }
		.order-list-1:last-child{
			border-bottom: none;
		}
    }
</style>